/* stylelint-disable selector-class-pattern */
.common-form {
  :deep() .wd-cell-group {

    .wd-picker__label,
    .wd-input__label {
      min-width: 160rpx !important;
      // width: 160rpx !important;
    }

    .wd-picker__cell--placeholder {
      .wd-cell__value {
        color: $uni-text-color-placeholder !important;
      }
    }

    .wd-input__placeholder,
    .wd-picker__placeholder,
    .wd-textarea__placeholder {
      color: $uni-text-color-placeholder !important;
    }

    .wd-input,
    .wd-cell,
    .wd-picker__cell {
      margin-bottom: $uni-spacing-col-lg;
      background: $uni-bg-color-input !important;
      border-radius: $uni-border-radius-lg;
    }

    .wd-cell__wrapper {
      display: block;
    }

    .flex-cell {
      .wd-cell__wrapper {
        display: flex;
      }
    }

    .wd-picker__cell,
    .wd-datetime-picker__cell {
      .wd-cell__wrapper {
        display: flex;
      }
    }

    .wd-input__label-inner,
    .wd-cell__title,
    .wd-picker__label {
      font-size: $uni-font-size-base;
      font-weight: 500;
      color: $uni-text-color;
    }

    .wd-picker__value {
      margin-right: 16rpx;
    }

    .wd-input__inner,
    .wd-picker__value {
      text-align: right;
    }

    .wd-picker__cell,
    .wd-datetime-picker__cell {
      .wd-cell__value {
        text-align: right;
      }
    }

    .wd-cell__title {
      .wd-cell__label {
        overflow: auto !important;
        font-size: $uni-font-size-base !important;
        font-weight: normal;
        color: $uni-text-color-grey !important;
        text-overflow: clip !important;
        white-space: normal !important;
      }
    }

    .wd-textarea,
    .wd-textarea__value {
      background: none;
    }

    .wd-textarea {
      padding: $uni-spacing-col-sm 0;
    }
  }
}


.common-page-bg {
  .common-form {
    :deep() .wd-cell-group {
      background: none;

      .wd-cell-group__body {
        background: none;
      }

      .wd-picker__label,
      .wd-input__label {
        min-width: 160rpx !important;
        // width: 160rpx !important;
      }

      .wd-picker__cell--placeholder {
        .wd-cell__value {
          color: #b8bec8 !important;
        }
      }

      .wd-input__placeholder,
      .wd-picker__placeholder,
      .wd-textarea__placeholder {
        color: #b8bec8 !important;
      }

      .wd-input,
      .wd-cell,
      .wd-picker__cell {
        margin-bottom: $uni-spacing-col-lg;
        background: #fff !important;
        border-radius: $uni-border-radius-lg;
      }

      .wd-cell__wrapper {
        display: block;
      }

      .flex-cell {
        .wd-cell__wrapper {
          display: flex;
        }
      }

      .wd-picker__cell,
      .wd-datetime-picker__cell {
        .wd-cell__wrapper {
          display: flex;
        }
      }

      .wd-input__label-inner,
      .wd-cell__title,
      .wd-picker__label {
        font-size: $uni-font-size-base;
        font-weight: 500;
        color: $uni-text-color;
      }

      .wd-picker__value {
        margin-right: 16rpx;
      }

      .wd-input__inner,
      .wd-picker__value {
        text-align: right;
      }

      .wd-picker__cell,
      .wd-datetime-picker__cell {
        .wd-cell__value {
          text-align: right;
        }
      }

      .wd-cell__title {
        .wd-cell__label {
          overflow: auto !important;
          font-size: $uni-font-size-base !important;
          font-weight: normal;
          color: $uni-text-color-grey !important;
          text-overflow: clip !important;
          white-space: normal !important;
        }
      }

      .wd-textarea,
      .wd-textarea__value {
        background: none;
      }

      .wd-textarea {
        padding: $uni-spacing-col-sm 0;
      }
    }
  }
}